<template>
    <fieldset>
        <legend>动态组件</legend>
        <h1 class="dynamic" :is="name">
            123
        </h1>
    </fieldset>
</template>
<script>
import comA from "./comA.vue"
import comB from "./comB.vue"
//通过给元素添加is属性,is的值是一个组件的名字,组件的结构会替换掉当前元素的结构
//属性会被继承
export default {
    data(){
        return {
            name:"comA"
        }
    },
    components: {
        comA,
        comB
    }
}
</script>
<style scoped>
.dynamic {
    border: 2px dashed hotpink
}
</style>